<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en-EN">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

	<title>{% block title %}e Student Management System{% endblock title %}</title>

	<script src="/site_media/sim/js/jquery-1.2.1.min.js" type="text/javascript"></script>
	<script src="/site_media/sim/js/menu-collapsed.js" type="text/javascript"></script>
	<link rel="stylesheet" type="text/css" href="/site_media/sim/css/style.css" />

	<SCRIPT type="text/javascript" src="/site_media/sim/js/jquery.js"></SCRIPT>
	<SCRIPT type="text/javascript" src="/site_media/sim/js/jquery.layout.js"></SCRIPT>
	<SCRIPT type="text/javascript">
	    $(document).ready(function () {
		    $('body').layout({ applyDefaultStyles: true });
		    });
	</SCRIPT>
</head>
<body>
    <div class="ui-layout-north">
	<!-- HEADER -->
	<p>Master head</p>
    </div>

    <div class="ui-layout-west">
	<!-- MAIN MENU -->
	<ul id="menu">
	    <li>
	    <a href="#">Menu 1</a>
	    <ul>
		<li><a href="">Menu 1.1</a></li>
		<li><a href="">Menu 1.2</a></li>
		<li><a href="">Menu 1.3</a></li>
		<li><a href="">Menu 1.4</a></li>
	    </ul>
	    </li>

	    <li>
	    <a href="#">Menu 2</a>
	    <ul>
		<li><a href="">Menu 2.1</a></li>
		<li><a href="">Menu 2.2</a></li>
		<li><a href="">Menu 2.3</a></li>
		<li><a href="">Menu 2.4</a></li>
		<li><a href="">Menu 2.5</a></li>
		<li><a href="">Menu 2.6</a></li>
	    </ul>
	    </li>

	    <li><a href="">Menu 3 (no submenu)</a></li>

	    <li>
	    <a href="#">Menu 4</a>
	    <ul>
		<li><a href="">Menu 4.0</a></li>
		<li><a href="">Menu 4.1</a></li>
		<li><a href="">Menu 4.2</a></li>
		<li><a href="">Menu 4.3</a></li>
	    </ul>
	    </li>

	    <li>
	    <a href="#">Menu 5</a>
	    <ul>
		<li><a href="">Menu 5.1</a></li>
		<li><a href="">Menu 5.2</a></li>
		<li><a href="">Menu 5.3</a></li>
		<li><a href="">Menu 5.4</a></li>
	    </ul>
	    </li>
	</ul>
    </div>

    <div class="ui-layout-center">
	<!-- PUT MAIN COLUMN CODE HERE -->
	<p>Main column code</p>
	<P><A href="http://layout.jquery-dev.net/demos.html">Go to the Demos page</A></P>
	<P>* Pane-resizing is disabled because ui.draggable.js is not linked</P>
	<P>* Pane-animation is disabled because ui.effects.js is not linked</P>
    </div>

    <div class="ui-layout-east">
	<!-- HELP SHOULD GO HERE -->
	<p>Help pane</p>
    </div>

    <div class="ui-layout-south">
	<!-- PUT FOOTER CODE HERE -->
	<p>Footer code</p>
    </div>
</body>
</html>
